#set(String title = "用户登录")
#tag layout_block("bodyContent")
<div class="columns">
    <div class="column is-2"></div>
    <div class="column is-5">
        <div class="message is-light">
            <div class="message-header">登录</div>
            <div class="message-body">
                <form id="signin-form">
                    <div class="field">
                        <div class="control has-icons-left has-icons-right">
                            <input id="username" name="username" class="input" type="text" placeholder="用户名/邮箱"/>
                            <span class="icon is-small is-left">
                          <i class="fa fa-user"></i>
                        </span>
                        </div>
                    </div>

                    <div class="field">
                        <p class="control has-icons-left">
                            <input id="password" name="password" class="input" type="password" placeholder="密码">
                            <span class="icon is-small is-left">
                          <i class="fa fa-lock"></i>
                        </span>
                        </p>
                    </div>

                    <div class="field">
                        <p class="control">
                        <div class="field">
                            <div class="control">
                                <div class="is-pulled-left">
                                    <label class="checkbox">
                                        <input name="remeberMe" type="checkbox"/> 记住我
                                    </label>
                                </div>
                                <div class="is-pulled-right">
                                    <a href="${siteUrl('forget')}">忘记密码</a>
                                </div>
                                <div class="is-clearfix"></div>
                            </div>
                        </div>
                        <div class="has-text-centered">
                            <button id="signin-btn" type="submit" class="button is-success">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;登&nbsp;录&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</button>
                        </div>
                        </p>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="column is-3">
        <div class="message is-light">
            <div class="message-header">其他平台登录</div>
            <div class="message-body has-text-centered">
                <a class="button is-black" data-no-instant href="${siteUrl('/auth/github/signin')}">
                    <span class="icon">
                      <i class="fa fa-github"></i>
                    </span>
                    <span>Github登录</span>
                </a>
            </div>
        </div>
    </div>
    <div class="column is-2"></div>
</div>
#end
#tag layout_block("footScript")
<script type="text/javascript" src="/static/plugins/jquery.validation/jquery.validate.min.js"></script>
<script type="text/javascript" src="/static/plugins/jquery.validation/localization/messages_zh.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#signin-form").validate({
            rules: {
                username: {
                    required: true,
                    minlength: 4
                },
                password: {
                    required: true,
                    minlength: 6
                }
            },
            messages: {
                username: {
                    required: "请输入用户名",
                    minlength: "请输入4位以上用户名"
                },
                password: {
                    required: "请输入密码",
                    minlength: "密码长度不能小于6位"
                }
            },
            submitHandler: function () {
                $('#signin-form #signin-btn').addClass('is-loading');
                Roo.post("/signin", $('#signin-form').serialize(),
                    $('#signin-form #signin-btn').addClass('is-loading');
                    function (data, textStatus, jqXHR) {
                        console.log(data);
                        if (data && data.success) {
                            window.location.href = '/';
                        } else {
                            Roo.alertError(data.msg || '登录失败');
                        }
                    });
            }
        });
    });
</script>
#end
#include('../layouts/default.html')